<template>
  <el-dialog :visible.sync="addVisible" @close="$emit('update:addVisible',false)" width="55%" :show-close='false'   class="addFilesDialog"
	 :closeOnClickModal='false'>
		<span slot="title" class="dialog-title">
		  附件上传
			<el-button  size="mini" @click="close" class="popupClose">关闭</el-button>
		</span>
    <div style="margin-bottom: 10px;overflow: hidden;" v-if="!shenpi"> 
      <input type="file" name="file" id="plFile" @change="upload" style="visibility: hidden;width: 0;height: 0;" multiple>
      <el-button size="mini" type="primary" style="float:right" @click="uploadClick" >上传附件</el-button>
    </div>
    <el-table :data="renwufujian" style="width: 100%;height:calc(100% - 40px)" class="tableCon" size="mini" highlight-current-row cell-class-name="batchtablecell"
    key="renwufujian">
      <div style="margin-bottom: 10px;overflow: hidden;">
        <input type="file" name="file" id="plFile" @change="upload" style="visibility: hidden;width: 0;height: 0;" multiple>
        <el-button size="mini" type="primary" style="float:right" @click="uploadClick" >上传附件</el-button>
      </div>
      <el-table-column label="序号" width="49px" fixed>
        <template slot-scope="scope">
          {{scope.$index+1}}
        </template>
      </el-table-column>
      <el-table-column prop="fileName" label="名称" min-width="90px">
      </el-table-column>
      <!-- <el-table-column label="上传人" prop="createByName" min-width="90px">
      </el-table-column> -->
      <el-table-column label="操作" min-width="90px">
        <template slot-scope="scope">
          <el-button type="text" size="small" @click="deleteattachment(scope.row,scope.$index)"  v-if="!shenpi">删除</el-button>
          <el-button type="text" size="small" @click="dlownloadattachment(scope.row)" v-if="scope.row.id">下载</el-button>
        </template>
      </el-table-column>
    </el-table>

		<span slot="footer" class="dialog-footer" v-if="!shenpi">
			<el-button type="primary" size="mini" @click="downFiles">确 定</el-button>
			<el-button  size="mini" @click="close">取 消</el-button>
		</span>
	</el-dialog>

</template>

<script>
	import { mapState } from 'vuex'


export default {
  data () {
    return {
      renwufujian:[],
    }
  },
  props:['addVisible','selectRow','shenpi'],
  computed: {
			...mapState(['yesorno', 'enableStatus','submitType',]),
	},


  mounted(){

  },
  watch:{
     addVisible(val, oldVal) {
				if (val) {
          if(this.selectRow.fileList){
            this.renwufujian = this.selectRow.fileList
          }else{
            this.renwufujian = []
          }

				}
			}
  },
  methods:{
    downFiles(){

    },
     close(){
    //     this.$refs.materialForm.resetFields();//重置表单
				// this.isRepeat = true;
				// this.materialForm = {
				// 	name: null,
    //       // number:null,
				// };
				this.$emit('update:addVisible', false);
    },
    uploadClick() {
      document.getElementById('plFile').click()
    },
    upload(event) {
      for (var i = 0; i < event.target.files.length; i++) {
        event.target.files[i].fileName = event.target.files[i].name

        this.renwufujian.push(event.target.files[i])
      }
      event.target.value= "";
    },
    deleteattachment(row,index){
      this.$confirm('是否删除', '提示', {
      	confirmButtonText: '确定',
      	cancelButtonText: '取消',
      	type: 'warning'
      }).then(() => {
        if(row.id){
          this.$http({
          	method: 'post',
          	apiUrl: '/download/fileDelete.htm',
          	params: {
          		id: row.id,
          	},
          	isJson: false,
          }).then(res => {
          	if (res.code === 0) {
          		this.$message({
          			type: 'success',
          			message: '删除成功!'
          		});
          	}
          })
        }
        this.renwufujian.splice(index,1)

      }).catch(() => {
      	this.$message({
      		type: 'info',
      		message: '已取消删除'
      	});
      });

    },
    downFiles(){
      this.selectRow.fileList = this.renwufujian
      this.close()
    },
    close(){
      this.$emit('update:addVisible',false)
    },
    dlownloadattachment(row) {
    	var url = "/download/fileDownload.htm"
       let token = sessionStorage.getItem('loginAccount')?sessionStorage.getItem('loginAccount'):undefined
    	window.open(process.env.baseUrl + url + '?id=' + row.id + "&token=" + token);
    },

  }
}
</script>

<style>
  .addFilesDialog .el-dialog {
    height:70% ;
  }
</style>
